<template>
	<view class="qydd">
		<view class="numberOfOrder">
			<!-- <uni-badge :text="orders.length" type="success">订单数：</uni-badge> -->
			<text>当前订单数{{ orders.length }}</text>
		</view>
		<view class="order_table">
			<uni-table v-for="(order, i) in orders" :key="i" :model="order">
				<uni-tr>
					<uni-th align="left">车辆编号：{{ order.vehicleId }}</uni-th>
				</uni-tr>
				<uni-tr>
					<uni-th align="left">站点名称：{{ order.coorName }}</uni-th>
				</uni-tr>
				<uni-tr>
					<button @click="orderEnd(i)" type="primary">清理完成</button>
				</uni-tr>
			</uni-table>
		</view>
	</view>
</template>

<script>
	import { getUserProfile } from "@/api/system/user";
	import { order, order_end } from "@/api/order/order"
	export default{
		
		data() {
			return{
				userId:'',
				orders:{},
				cleanApplication:{},
				length:''
			}
		},
		mounted() {
			getUserProfile().then(res => {
				this.userId=res.data.userId
				console.log(this.userId)
				this.cleanApplication.userId=res.data.userId
				order(this.cleanApplication).then(res=>{
					console.log(res.data)
					this.orders=res.data
					console.log(this.orders)
				})
			})
		},
		methods: {
			orderEnd(e) {
				order_end(this.orders[e]).then(
					this.orders.splice(e, 1)
				)
			}
		}
	}
</script>

<style>

	/* 订单数量显示 */
	.numberOfOrder {
	  text-align: center; /* 文字居中 */
	  margin-bottom: 10px;
	}
	
	.numberOfOrder text {
	  font-size: 18px;
	  color: #333;
	}
	.order_table {
		padding-left: 3vw;
		padding-right: 3vw;
	}
	button{
		width: 90vw;
	}
</style>